@extends('common.base-master')

@section('html-head')
    <link href="{{url('css/createFacilitator.css')}}" type="text/css" rel="stylesheet"/>
    <link href="{{url('css/autoMail.css')}}" type="text/css" rel="stylesheet"/>
    <script src="{{url('js/createFacilitator.js')}}"></script>
    <script src="{{url('js/lib/area.js')}}"></script>
    <script src="{{url('js/lib/area2.js')}}"></script>
    <link rel="stylesheet" href="{{url('/css/jquery.Jcrop.css')}}" type="text/css" />
    <script src="{{url('/js/lib/jquery.Jcrop.js')}}"></script>
    <script src="{{url('/js/lib/jquery.color.js')}}"></script>
    <script src="{{url('/js/lib/autoMail.js')}}"></script>
@endsection

@section('html-body')
    <main>
        <section class="banner">
            <div>
                <p class="title">高质量业务，<em class="color">只需三步！</em></p>
                <p class="desc">Wike将根据您完善的资料，审核后为您推荐合适业务</p>
            </div>
        </section>
        <section style="height: 330px;@if($facInfo && $orgInfo && ($examInfos !== ''))display: block @else display: none @endif">
            <div style="text-align: center">
                您已提交了认证，请到 <a href="{{route('Home.Service.userCenter')}}" style="color:darkcyan;cursor:hand; text-decoration:underline">[管理中心]</a> 修改资料
            </div>
        </section>
        <section class="tableBox" @if($examInfos && $examInfos == '') style="display: none" @else style="display: block" @endif>
            <div class="first" style="display: block;">
                <ul>
                    <form id="setFacInfo">
                    <li class="real_name"><em>真实姓名</em><input type="text" name="realname" value="{{$facInfo->realname}}" /><em class="realName_error error"></em></li>
                    <li class="contact"><em>联系电话</em><input type="text" name="telephone" value="{{$facInfo->telephone}}" /><em class="contact_error error"></em></li>
                    <li class="qq"><em>联系QQ</em><input type="text" name="qq" value="{{$facInfo->qq}}" /><em class="qq_error error"></em></li>
                    <li class="email"><em>联系邮箱</em><input type="text" id="email" name="email" value="{{$facInfo->email}}" /><em class="email_error error"></em></li>
                    <li class="id"><em>身份证号</em><input type="text" name="card_num"  value="{{$facInfo->card_num}}" /><em class="id_error error"></em></li>
                    <li class="identityCard">
                        <em>身份证号上传</em>
                        <div>
                            <P>
                                <a href="javascript:void(0)" id="cardfBtn" ><span id="cardf_cue">上传您的身份证正面</span></a><br />
                                <em class="prompt">上传文件大小不能超过1m 支持png，jpg格式</em>
                                <input type="hidden" name="cardf_id" id="cardf_id" value="{{$facInfo->img_cardf_id}}" />
                            </P>
                            <P>
                                <a href="javascript:void(0)" id="cardbBtn"><span id="cardb_cue">上传您的身份证背面</span></a><br />
                                <em class="prompt">上传文件大小不能超过1m 支持png，jpg格式</em>
                                <input type="hidden" name="cardb_id" id="cardb_id" value="{{$facInfo->img_cardb_id}}" />
                            </P>

                        </div>
                        <input type="hidden" name="state" value="1" />
                    </li>
                    </form>
                </ul>
                <div class="idCard">
                    <img id="cardf_img" src="{{route('Api.Cardf.Show',['id'=>$user->id])}}" class="front" /><img id="cardb_img" src="{{route('Api.Cardb.Show',['id'=>$user->id])}}" class="after" />
            	 </div>
                <p class="next"><button href="#">下一步</button><em>距离入驻还有两步</em></p>
            </div>
            <div class="second"  style="display: none;">
                <div class="team">
                    <ul>
                        <form id="org_info">
                        <li class="upload">
                            <em>上传标志</em>
                            <div class="inline">
                                <dl>
                                    <dt><a href="javascript:void(0);" id="uplogo"><img id="logo_img" src="{{route('Api.OrgPhoto.Show',['id'=>$user->id])}}" style="width: 65px;height: 65px"></a></dt>
                                    <dd></dd>
                                </dl>
                            </div>
                        </li>
                        <li class="serves_type">
                            <em>服务性质</em>
                            <div class="inline">
                                <p><input type="radio" name="type" class="personal" data-type="0" value="0" @if($orgInfo && $orgInfo->org_type == 0) checked @endif/>个人</p>
                                <p><input type="radio" name="type" data-type="1" value="1" @if($orgInfo && $orgInfo->org_type == 1) checked @endif />工作窒</p>
                                <p><input type="radio" name="type" data-type="2" value="2" @if($orgInfo && $orgInfo->org_type == 2) checked @endif />公司</p>
                            </div>
                        </li>
                        <li class="companyName comp" @if($orgInfo && $orgInfo->org_type == 0) style="display: none" @endif>
                            <em>公司名字</em>
                            <div class="inline"><input type="text" name="org_name" value="{{$orgInfo?$orgInfo->org_name:''}}"><em class="compn_error error"></em></div>
                        </li>
                        <li class="companyDesc comp" @if($orgInfo && $orgInfo->org_type == 0) style="display: none" @endif>
                            <em>公司简介</em>
                            <div class="inline"><textarea name="org_desc">{{$orgInfo?$orgInfo->org_desc:''}}</textarea><em class="compd_error error"></em></div>
                        </li>

                        <li class="personDesc" @if($orgInfo && $orgInfo->org_type !== 0) style="display: none" @endif>
                            <em>个人简介</em>
                            <div class="inline">
                                <textarea name="people_desc">{{$orgInfo?$orgInfo->people_desc:''}}</textarea>
                                <em class="personDesc_error error"></em>
                            </div>
                        </li>
                        <li class="areas">
                            <em>所在地区</em>
                            <div class="distruct">
                                <select id="o_province" name="o_province"></select>  
                                <select id="o_city" name="o_city" ></select>  
                                <select id="o_county" name="o_county"></select>
                                @if($orgInfo && $orgInfo->province && $orgInfo->city && $orgInfo->area)<script>opt1 = ["{{$orgInfo->province}}","{{$orgInfo->city}}","{{$orgInfo->area}}"]</script>@endif
                                <script type="text/javascript">_init_area2();</script>
                            </div>
                        </li>
                        <li class="trade">
                            <em>行业经验</em>
                            <div class="inline">
                                <select class="exper" name="experience">
                                    <option value="1" @if($orgInfo && $orgInfo->experience == 1)selected @endif>1年</option>
                                    <option value="2" @if($orgInfo && $orgInfo->experience == 2)selected @endif>2年</option>
                                    <option value="3" @if($orgInfo && $orgInfo->experience == 3)selected @endif>3年</option>
                                    <option value="4" @if($orgInfo && $orgInfo->experience == 4)selected @endif>4年</option>
                                    <option value="5" @if($orgInfo && $orgInfo->experience == 5)selected @endif>5年</option>
                                    <option value="10" @if($orgInfo && $orgInfo->experience == 10)selected @endif>10年以上</option>
                                </select>
                            </div>
                            <em class="trade_error error"></em>
                        </li>
                        <li class="fields">
                            <em>擅长领域</em>
                            <div class="inline" style="width: 290px;">
                                {{--<select name="field">--}}
                                    {{--@foreach($fields as $field)--}}
                                        {{--<option value="{{$field->id}}" @if($orgInfo && $orgInfo['field'][0] == $field->id) selected @endif>{{$field->field}}</option>--}}
                                    {{--@endforeach--}}
                                {{--</select>--}}
                                @foreach($fields as $field)
                                <input name="field" type="checkbox" value="{{$field->id}}" @if($orgInfo && in_array($field->id,$orgInfo['field'])) checked @endif />{{$field->field}}
                                @endforeach
                            </div>
                        </li>
                        <li class="skills">
                            <em>开发技能</em>
                            <div class="inline" style="width: 290px;">
                                {{--<select name="skill">--}}
                                    {{--@foreach($skills as $skill)--}}
                                        {{--<option value="{{$skill->id}}" @if($orgInfo && $orgInfo['skill'][0] == $skill->id) selected @endif>{{$skill->skill}}</option>--}}
                                    {{--@endforeach--}}
                                {{--</select>--}}
                                @foreach($skills as $skill)
                                    <input name="skill" type="checkbox" value="{{$skill->id}}" @if($orgInfo && in_array($skill->id,$orgInfo['skill'])) checked @endif/>{{$skill->skill}}
                                @endforeach
                            </div>
                        </li>
                        <li class="invoice">
                            <em>发票情况</em>
                            <div class="inline">
                                <select name="has_invoice">
                                    <option value="0" @if($orgInfo && $orgInfo->has_invoice == 0) selected @endif>不能开发票</option>
                                    <option value="1" @if($orgInfo && $orgInfo->has_invoice == 1) selected @endif>开发票</option>
                                </select>
                            </div>
                        </li>
                        <li class="peoples comp" @if($orgInfo && $orgInfo->org_type == 0) style="display: none" @endif>
                            <em>公司人数</em>
                            <div class="inline"><input type="text" name="team_num" value="{{$orgInfo?$orgInfo->team_num:''}}"><em class="peoples_error error"></em></div>
                        </li>
                        <li class="plan">
                            <em>解决方案</em>
                            <div class="inline"><textarea name="solution">{{$orgInfo ?$orgInfo->solution:''}}</textarea><em class="plan_error error"></em></div>
                        </li>
                        <li class="service">
                            <em>附加服务</em>
                            <div class="inline"><input type="text" name="other_service" value="{{$orgInfo?$orgInfo->other_service:''}}"><em class="service_error error"></em></div>
                            <input type="hidden" name="state" value="1" />
                        </li>
                        </form>
                    </ul>
                    <p class="next"><button>下一步</button><em>距离入驻剩下一步</em></p>
                </div>
            </div>
            <div class="last" style="display: none;">
                <div class="example">
                    <div class="addExample">
                        <div class="uploadExample" style="display: block;">
                            <ul>
                                <form id="setExamInfo">
                                <li><a href="javascript:void(0)" id="upExampleImg"><img id="target" src="{{url('images/upload_2.jpg')}}" style="width: 460px;height:300px"></a><input type="hidden" id="examImgId" name="exam_id" value="" /><input type="hidden" name="org_id" value="{{$orgInfo?$orgInfo->id:''}}" /></li>
                                    {{--<img id="preview" width="200px" height="200px" />--}}
                                {{--<li><input type="button" id="test" onclick="test()" value="确定剪裁"></li>--}}
                                <li class="exampleTitle"><em>案例标题</em><input type="text" name="title"><em class="titleError error" style="display: none">必填</em></li>
                                <li class="exampleDesc"><em>案例简述</em><textarea name="desc"></textarea><em class="descError error" style="display: none">必填</em></li>
                                <li class="exampleLink"><em>案例链接</em><input type="text" name="url"><em class="linkError error" style="display: none">必填</em></li>
                                <li><button class="save">保存</button><button class="clear">取消</button></li>
                                </form>
                            </ul>
                        </div>
                    </div>
                    <button class="submit" id="postInfo">申请入驻</button>
                </div>
            </div>
        </section>
    </main>
    <script>
        var Home = "{{route('Home')}}";
        var setFacInfoUrl = "{{route('Api.Fac.setUserInfo')}}";
        var setOrgInfoUrl = "{{route('Api.Org.setOrgInfo')}}";
        var setExamInfoUrl = "{{route('Api.Exam.setExampleInfo',['id'=>0])}}";
        var imgUrl = "{{url('images/upload_2.jpg')}}";

        $(document).ready(function(){
            $('#email').autoMail({
                emails:['qq.com','163.com','126.com','sina.com','sohu.com','yahoo.cn','gmail.com','hotmail.com','live.cn']
            });
        });
//        var api;
//        $('#target').Jcrop({
//            // start off with jcrop-light class
//            onChange: showPreview,
//            onSelect: showPreview,
//            aspectRatio: 1
//        });
//
//        function showPreview(coords)
//        {
//            var rx = 100 / coords.w;
//            var ry = 100 / coords.h;
//
//            $('#preview').css({
//                width: Math.round(rx * 500) + 'px',
//                height: Math.round(ry * 370) + 'px',
//                marginLeft: '-' + Math.round(rx * coords.x) + 'px',
//                marginTop: '-' + Math.round(ry * coords.y) + 'px'
//            });
//        }
//
//        function test(){
//            api.onSelect(function(){
//
//                api.destroy();
//            });
//
//        }

            var uploader = new plupload.Uploader({
                runtimes: 'html5,flash,silverlight,html4',
                browse_button: 'cardfBtn',
                url: '{{url('api/upload/image')}}',

                chunk_size: '20mb',
                filters: {
                    max_file_size: '10mb',
                    mime_types: [
                        {title: "Image files", extensions: "jpg,gif,png"}
                    ],
                    prevent_duplicates: false
                },
                multi_selection: true,
                unique_names: true,

                flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
                silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

                file_data_name: 'photo',
                headers: {
                    Accept: 'application/json'
                },

                multipart_params: {
                    _token: '{{ csrf_token() }}'
                },

                init: {
                    PostInit: function () {
                    },

                    FilesAdded: function (up, files) {
                        up.start();
                    },

                    BeforeUpload: function (up, file) {
                        up.settings.multipart_params.file_name = file.name;
                    },

                    UploadProgress: function (up, file) {

                    },

                    Error: function (up, err) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(err.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }

                        noty({
                            type: 'error',
                            text: err.message + ' ' + responseMessage,
                            timeout: 800
                        });
                    },

                    FileUploaded: function (up, file, info) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(info.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }
                        var imageId = responseObj.data.id;
                        $('#cardf_id').val(imageId);
                        var d = new Date();
                        var imageUrl = "{{route('Api.GetImage.Image',['id'=>'.'])}}/" + imageId + "?" + d.getTime();
                        $('#cardf_img').attr('src', imageUrl);
                    }
                }
            });
            uploader.init();

        /*  ------------------上次身份证反面-------------*/
            var uploader2 = new plupload.Uploader({
                runtimes: 'html5,flash,silverlight,html4',
                browse_button: 'cardbBtn',
                url: '{{url('api/upload/image')}}',

                chunk_size: '20mb',
                filters: {
                    max_file_size: '10mb',
                    mime_types: [
                        {title: "Image files", extensions: "jpg,gif,png"}
                    ],
                    prevent_duplicates: false
                },
                multi_selection: true,
                unique_names: true,

                flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
                silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

                file_data_name: 'photo',
                headers: {
                    Accept: 'application/json'
                },

                multipart_params: {
                    _token: '{{ csrf_token() }}'
                },

                init: {
                    PostInit: function () {
                    },

                    FilesAdded: function (up, files) {
                        up.start();
                    },

                    BeforeUpload: function (up, file) {
                        up.settings.multipart_params.file_name = file.name;
                    },

                    UploadProgress: function (up, file) {

                    },

                    Error: function (up, err) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(err.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }

                        noty({
                            type: 'error',
                            text: err.message + ' ' + responseMessage,
                            timeout: 800
                        });
                    },

                    FileUploaded: function (up, file, info) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(info.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }
                        var imageId = responseObj.data.id;
                        $('#cardb_id').val(imageId);
                        var d = new Date();
                        var imageUrl = "{{route('Api.GetImage.Image',['id'=>'.'])}}/" + imageId + "?" + d.getTime();
                        $('#cardb_img').attr('src', imageUrl);
                    }
                }
            });
            uploader2.init();

        /*-----------上传logo-----------------------*/
        var uploader3 = new plupload.Uploader({
            runtimes: 'html5,flash,silverlight,html4',
            browse_button: 'uplogo',
            url: '{{url('api/upload/image')}}',

            chunk_size: '20mb',
            filters: {
                max_file_size: '10mb',
                mime_types: [
                    {title: "Image files", extensions: "jpg,gif,png"}
                ],
                prevent_duplicates: false
            },
            multi_selection: true,
            unique_names: true,

            flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
            silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

            file_data_name: 'photo',
            headers: {
                Accept: 'application/json'
            },

            multipart_params: {
                _token: '{{ csrf_token() }}'
            },

            init: {
                PostInit: function () {
                },

                FilesAdded: function (up, files) {
                    up.start();
                },

                BeforeUpload: function (up, file) {
                    up.settings.multipart_params.file_name = file.name;
                },

                UploadProgress: function (up, file) {

                },

                Error: function (up, err) {
                    var responseObj = '', responseMessage = '';
                    try {
                        responseObj = $.parseJSON(err.response);
                        responseMessage = responseObj.message;
                    } catch ($e) {

                    }

                    noty({
                        type: 'error',
                        text: err.message + ' ' + responseMessage,
                        timeout: 800
                    });
                },

                FileUploaded: function (up, file, info) {
                    var responseObj = '', responseMessage = '';
                    try {
                        responseObj = $.parseJSON(info.response);
                        responseMessage = responseObj.message;
                    } catch ($e) {

                    }

                    $.ajax({
                        type: "post",
                        url: '{{route('Api.Org.setOrgInfo')}}',
                        dataType: "json",
                        data: {'logo_id': responseObj.data.id},
                        success: function (obj) {
                            if (obj.level === "success") {
                                var d = new Date();
                                imageUrl = "{{route('Api.OrgPhoto.Show',['id'=>'.'])}}/" + {{$user->id}} + "?" + d.getTime();
                                $('#logo_img').attr('src', imageUrl);
                            }
                        },
                        error: function (obj) {
                            var datajson = obj.responseJSON;
                            noty({text: datajson.message, type: datajson.level, timeout: 800});
                        }
                    });
                }
            }
        });
        uploader3.init();

        /*  ------------------上传案例截图-------------*/
        var uploader4 = new plupload.Uploader({
            runtimes: 'html5,flash,silverlight,html4',
            browse_button: 'upExampleImg',
            url: '{{url('api/upload/image')}}',

            chunk_size: '20mb',
            filters: {
                max_file_size: '10mb',
                mime_types: [
                    {title: "Image files", extensions: "jpg,gif,png"}
                ],
                prevent_duplicates: false
            },
            multi_selection: true,
            unique_names: true,

            flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
            silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

            file_data_name: 'photo',
            headers: {
                Accept: 'application/json'
            },

            multipart_params: {
                _token: '{{ csrf_token() }}'
            },

            init: {
                PostInit: function () {
                },

                FilesAdded: function (up, files) {
                    up.start();
                },

                BeforeUpload: function (up, file) {
                    up.settings.multipart_params.file_name = file.name;
                },

                UploadProgress: function (up, file) {

                },

                Error: function (up, err) {
                    var responseObj = '', responseMessage = '';
                    try {
                        responseObj = $.parseJSON(err.response);
                        responseMessage = responseObj.message;
                    } catch ($e) {

                    }

                    noty({
                        type: 'error',
                        text: err.message + ' ' + responseMessage,
                        timeout: 800
                    });
                },

                FileUploaded: function (up, file, info) {
                    var responseObj = '', responseMessage = '';
                    try {
                        responseObj = $.parseJSON(info.response);
                        responseMessage = responseObj.message;
                    } catch ($e) {

                    }
                    var d = new Date();
                    var imageId = responseObj.data.id;
                    $('#examImgId').val(imageId);
                    var imageUrl = "{{route('Api.GetImage.Image',['id'=>'.'])}}/" + imageId + "?" + d.getTime();
                    $('#target').attr('src', imageUrl);
                }
            }
        });
        uploader4.init();
    </script>
@endsection